import React, { Component } from 'react';
import { DragSource } from 'react-dnd';

const knightSource = {
  beginDrag(props:any) {
    return {};
  }
};

function collect(connect:any, monitor:any) {
  return {
    connectDragSource: connect.dragSource(),
    isDragging: monitor.isDragging()
  }
}

@DragSource("K", knightSource, collect)
export default class Knight extends Component<any ,any> {
  public render() {
    const { connectDragSource, isDragging } = this.props;
    return connectDragSource(
      <div style={{
        opacity: isDragging ? 0.5 : 1,
        fontSize: 25,
        fontWeight: 'bold',
        cursor: 'move'
      }}>
        ♘
      </div>
    );
  }
}